<template>
     <el-row>
        <el-col :span="1" :offset="2"><img class="icon" src="https://p9-passport.byteacctimg.com/img/user-avatar/107d913428fc6d9698b04fc23abb9550~300x300.image"></el-col>
        <el-col :span="6">{{item.nick_name}}</el-col>
    </el-row>
    <el-row>
        <el-col :offset="3">
            <div v-html="item.comment_info"></div>
        </el-col>
    </el-row>
     <el-row>
        <el-col :offset="3">
            <el-button size="small" @click="start_comment(index,child_index)" v-if="!item.commenting">回复</el-button>
             <el-button size="small" @click="start_comment(index,child_index)" v-else>取消回复</el-button>
        </el-col>
    </el-row>
     <el-row v-if="item.commenting">
        <el-col :offset="3">
            {{props.addComment}}|||
           <comment :addComment="props.addComment"></comment>
        </el-col>
    </el-row>
</template>
<script setup>
  import comment from "./comment.vue"
  let props=defineProps(["start_comment",'item',"index","child_index","addComment"])
  console.log(props);
    let start_comment=props.start_comment
    let item=props.item
   let index=props.index
   let child_index=props.child_index
</script>
